<template>
    <el-dialog :title="ID?'修改考试批次':'新建考试批次'" :visible.sync="windowVisible" width="1000px" :close-on-click-modal="false">
        <div class="my-form-container" style="height:402px;width: 800px;">
            <el-form ref="dataForm" :model="dataForm" class="demo-ruleForm">
                <el-row class="my-form-item">
                    <el-col :span="24">
                        <div class="my-form-item-label">考试日期</div>
                        <div class="my-form-item-value">
                            <el-date-picker class="time" v-model="dataForm.examDate" type="date" value-format="yyyy-MM-dd"></el-date-picker>
                        </div>
                    </el-col>
                </el-row>
                <el-row class="my-form-item">
                    <el-col :span="24">
                        <div class="my-form-item-label">考试类型</div>
                        <div class="my-form-item-value">
                            <el-select v-model="dataForm.examTypeId" placeholder="请选择" style="width: 156px"  @change="changeType">
                                <el-option v-for="item in typeList" :key="item.id" :label="item.typeName" :value="item.id"></el-option>
                            </el-select>
                        </div>
                    </el-col>
                </el-row>
                <el-row class="my-form-item">
                    <el-col :span="24">
                        <div class="my-form-item-label">总分</div>
                        <el-form-item  prop="nativePlace">
                            <div class="my-form-item-value">
                                <el-input class="inputWidth" v-model="dataForm.totalPoint"></el-input>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row class="my-form-item">
                    <el-col :span="24">
                        <div class="my-form-item-label">分数线</div>
                        <el-form-item  prop="nativePlace">
                            <div class="my-form-item-value">
                                <span>优秀线</span>
                                <el-input class="inputWidth80" v-model="dataForm.excellentLine"></el-input>
                                <span>良好线</span>
                                <el-input class="inputWidth80" v-model="dataForm.goodLine"></el-input>
                                <span>及格线</span>
                                <el-input class="inputWidth80" v-model="dataForm.passLine"></el-input>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row class="my-form-item">
                    <el-col :span="24">
                        <div class="my-form-item-label">考试负责单位</div>
                        <el-form-item  prop="jszw">
                            <div class="my-form-item-value">{{dataForm.unitName}}</div>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row class="my-form-item" style="border:none;height: 100px;">
                    <el-col :span="24">
                        <div class="my-form-item-label">全国成绩情况</div>
                        <el-form-item  prop="jszw">
                            <div class="my-form-item-value assessment-design" style="line-height:88px">
                                <el-input type="textarea" style="width: 400px;" :rows="3" v-model="dataForm.countryInfo"></el-input>
                            </div>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div class="button-group">
            <div @click="saveEdit">保存</div>
            <div @click="windowVisible=false">取消</div>
        </div>
    </el-dialog>
</template>
<script>
import {addBatch,examBatchDetail,examTypeList} from "@/api/exam";

export default {
  data() {
    return {
      windowVisible:false,
      dataForm:{
        examDate:'',//考试日期
        examTypeId:'',//考试类型ID
        examTypeName:'',//考试类型名称
        excellentLine:'',//优秀线
        goodLine:'',//良好线
        passLine:'',//及格线
        totalPoint:'',//总分
        countryInfo:'',//全国情况
        id:'',
      },
      typeList:[],
    };
  },
  props:{
	ID:String
  },
  watch:{
    ID(val){
        if(val && this.windowVisible){
            this.dataForm.id = val;
            this.getDetail(val)
        }else{
            Object.assign(this.dataForm,this.$options.data().dataForm);
        }
    }
  },
  mounted(){
    this.getTypeList()
  },
  methods: {
    async getTypeList(){
        let res = await examTypeList({size:9999,current:1})
        this.typeList = res.data.records
    },
    changeType(e){
        let info = this.typeList.filter(item=>item.id == e);
        this.dataForm.excellentLine = info[0].excellentLine
        this.dataForm.goodLine = info[0].goodLine
        this.dataForm.passLine = info[0].passLine
        this.dataForm.totalPoint = info[0].totalPoint
        this.dataForm.unitId = info[0].unitId
        this.dataForm.unitName = info[0].unitName
        console.log(info)
    },
    async saveEdit(){
        let res = await addBatch(this.dataForm);
        if(res.code == 200){
            this.windowVisible = false;
            this.$emit('savePC')
        }
    },
    async getDetail(ID){
        let res = await examBatchDetail({id:ID});
        if(res.code == 200){
            this.dataForm = res.data
        }
    }
  },
};
</script>

<style lang="less" scoped>
@import "../../../styles/commonCss.less";
.my-form-container .my-form-item > div .my-form-item-label{width: 200px;padding-left: 0;justify-content: center;}
.button-group{
    padding-bottom: 56px;
}
.assessment-design {
    .el-textarea__inner {
        resize: none;
        font-size: 16px;
        color: rgba(0, 76, 167, 1);
    }
}
.inputWidth80{width: 80px;margin:0 30px 0 6px;}
</style>
